fix(UI):Module import configuration#1178
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
There was a problem hiding this comment.
Pull Request Overview
This PR fixes the import of UnderlinePanels from the Primer React experimental package and adds logic to close the editor bubble menu when clicking outside it.
- Destructure
UnderlinePanelsviarequireinstead of assigning the entire module. - Introduce a
useEffecthook inEditorBubbleMenuto handle outside clicks and blur the editor.
Reviewed Changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| moon/apps/web/pages/[org]/mr/[id].tsx | Updated module import to destructure UnderlinePanels from the experimental package. |
| moon/apps/web/components/EditorBubbleMenu/EditorBubbleMenu.tsx | Added an effect that listens for outside clicks to clear selection and hide the bubble menu. |
Comments suppressed due to low confidence (1)
moon/apps/web/components/EditorBubbleMenu/EditorBubbleMenu.tsx:149
- [nitpick] Add unit or integration tests for the outside-click behavior to ensure the bubble menu reliably hides when clicking outside the editor area.
useEffect(() => {
| const { data: MrDetailData, isLoading: detailIsLoading } = useGetMrDetail(id) | ||
| const mrDetail = MrDetailData?.data as MRDetail | undefined | ||
| const UnderlinePanels = require('@primer/react/experimental') | ||
| const { UnderlinePanels } = require('@primer/react/experimental') |
There was a problem hiding this comment.
Consider moving this import to a static top-level import { UnderlinePanels } from '@primer/react/experimental' to avoid requiring the module on each render and improve readability.
| const { UnderlinePanels } = require('@primer/react/experimental') | |
| // Removed dynamic import of UnderlinePanels |
| return | ||
| } | ||
|
|
||
| const handleClickOutside = (event: Event) => { |
There was a problem hiding this comment.
[nitpick] Extract the outside-click logic into a reusable custom hook (e.g., useClickOutside) to reduce boilerplate and improve maintainability across components.
No description provided.